<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        *{
            margin: 0;
            padding: 0;
        }
        .wrap{
            width: 100%;
            height: 100%;
            margin-top: 200px;
            display: flex;
            flex-direction: column;
            text-align: center;
        }
        p{
            /* display: inline-block; */
            font-size: 100px;
        }
        #text{
           
        }
    </style>
</head>
<body>
    <div class="wrap">
        <p>距离双11还有</p>
        <p id="text"></p>
    </div>
    <script>
        function color(){
            let res=Math.floor(Math.random()*255)
                return res;
        }

           function time(t){
            let nowtime=+new Date()
            let endtime=+new Date(t);
            let time=(endtime-nowtime)/1000;
            let day=parseInt(time/3600/24);
            let hour=parseInt(time/3600%24);
            let min=parseInt(time/60%60)
            let sec=parseInt(time%60)
            document.querySelector('#text').innerHTML=`${day}天${hour}时${min}分${sec}秒`;
            document.querySelector('#text').style.color=`rgb(${color()},${color()},${color()})`
            document.querySelector('body').style.backgroundColor=`rgb(${color()},${color()},${color()})`;

            return `${day}天${hour}时${min}分${sec}秒`;
        }
        
            setInterval(function(){
                time('2022-11-11 00:00')
                
            },1000)
               console.log(time('2022-11-11 00:00'));
            
   
    </script>
</body>
</html>